<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Customer</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/common.js" type="text/javascript"></script>
    <script src="js/jsrender.js"></script>
    <script type="text/javascript">
        $(function () {
        	//将true与false转化为已占用和空闲
        	$.views.converters("booleanformat",function(val){
        		if(val)return "已占用"
        		else return "空闲"
        	})
            //请求所有床位信息
            $.ajax({
                url:GC.bctx + "customers/listBed",//后端请求映射路径
                type:"GET",
                headers: {"Authorization": localStorage.getItem("token")},
                success:function (r) {
                    if(r.successed){
                        //jsrender模板渲染
                        $("#bed").html($("#bedTemplate").render(r.data))
                    }else{
                        alert(r.message)
                    }
                }
            })
            //响应入住登记
            $("#new").click(function() {
                alert("undone")
            })
            //修改描述
            $("#bed").on("click",".btn-update",function () {
                var id = $(this).attr("data-id")
                var desc = prompt("输入描述：",$(this).attr("data-default"))
                $.ajax({
                    url:GC.bctx + "customers/updateBed",
                    type:"PUT",
                    data:{bedid:id , bedDescription:desc},
                    headers: {"Authorization": localStorage.getItem("token")},
                    success:function(r){
                        if(r.successed){
                            //成功后
                            alert(r.message)
                            window.location.href="listBed.html"
                        }else{
                            alert(r.message)
                        }
                    }
                })

            })
            
        })
    </script>
    <script id="bedTemplate" type="text/x-jsrender">
	<tr align="center" >
		<td>{{:bedid}}</td>
		<td>{{booleanformat:bedoccupytatus}}</td>
		<td>{{:beddescription}}</td>
		<td colspan="2" align="center">
            <button id="updateBed" class="btn btn-update btn-info" data-id="{{:bedid}}" data-default="{{:bedDescription}}">修改描述</button>
         </td>
	</tr>
    </script>
</head>
<body>
    

    <table class="table table-bordered"">
        <tr>
            <th>床位id</th>
            <th>床位状态</th>
            <th>描述</th>
            <th>修改描述</th>
        </tr>

        <tbody id="bed"></tbody>
    </table>
</body>
</html>